﻿
@{
    ViewBag.Title = "Index";
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <!-- Required meta tags-->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <!-- Your app title -->
    <title> @ViewBag.Title</title>
    <!-- Path to Framework7 Library CSS, iOS Theme -->
    <link href="~/Content/framework7.ios.min.css" rel="stylesheet" />
    <!-- Path to Framework7 color related styles, iOS Theme -->
    <link href="~/Content/framework7.ios.colors.min.css" rel="stylesheet" />
    <!-- Path to your custom app styles-->
    <link href="~/Content/my-app.css" rel="stylesheet" />
    <link href="~/Content/framework7-icons.css" rel="stylesheet" />
</head>
<body>
    <!-- App Root Element -->
    <div class="view view-main" id="app">


        <!-- Views -->
        <f7-views>
            <!-- Your main view, should have "main" prop -->
            <f7-view main>
                <!-- Pages container, because we use fixed navbar and toolbar, it has additional appropriate props -->
                <f7-pages navbar-fixed toolbar-fixed>
                    <!-- Initial Page -->
                    <f7-page>
                        <!-- Top Navbar-->
                        <f7-navbar title="领卷铺" back-link="返回"></f7-navbar>
                        <!-- Toolbar-->
                        <f7-toolbar>
                            <div class="toolbar tabbar tabbar-labels">
                                <div class="toolbar-inner">
                                    <a href="#" class="tab-link" data-tab="#tab1">
                                        <i class="icon f7-icons size-12">home</i>
                                    </a>
                                    <a href="#" class="tab-link" data-tab="#tab1">
                                        <i class="icon f7-icons">search</i>
                                    </a>
                                    <a href="#" class="tab-link" data-tab="#tab1">
                                        <i class="icon f7-icons">eye</i>
                                    </a>
                                    <a href="#" class="tab-link" data-tab="#tab1">
                                        <i class="icon f7-icons color-red">bag_fill</i>
                                    </a>
                                </div>
                            </div>
                        </f7-toolbar>
                        <!-- Page Content -->
                        <p>Page content goes here1</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <p>Page content goes here</p>
                        <f7-link href="/about/">About App</f7-link>
                    </f7-page>
                </f7-pages>
            </f7-view>
        </f7-views>

    </div>
    <!-- Path to Vue js -->
    <script src="~/Scripts/vue.min.js"></script>
    <!-- Path to Framework7 Library JS-->
    <script src="~/Scripts/framework7.min.js"></script>
    <!-- Path to Framework7 Vue Plugin -->
    <script src="~/Scripts/framework7-vue.min.js"></script>
    <!-- Path to your app js where you init your app-->
    <script src="~/Scripts/my-app.js"></script>
    <script>
        // First of all, we need to initialize/enable Framework7 Vue plugin:
        Vue.use(Framework7Vue);
        // Init Vue App
        var app = new Vue({
            // App Root Element
            el: '#app',
            // Init Framework7. All Framework7 parameters should be passed in "framework7" property, e.g.:
            framework7: {
                // App Root Element, should be the same as the component root "el"
                root: '#app',
                // Array with app routes

                // Any other parameters, e.g.
                animateNavBackIcon: true,
                swipePanel: 'left'
            },
            // App root data
            data: {
                // ....
            },
            // App root methods
            methods: {
                onChipDelete: function () {
                    alert(onChipDelete)
                }

            }
        })
    </script>
</body>
</html>
